<template>
  <div>
    <h3>选择你喜欢的专栏</h3>
    <span v-for="item in array" :key="item.title">
      <input type="checkbox" v-model="item.c"  />{{
        item.title
      }}</span
    >

    <ul>
      <li v-for="item1 in newArr" :key="item1.title" >
        {{ item1.title }}
      </li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      array: [
        { title: "科幻", c: false },
        { title: "喜剧", c: false },
        { title: "动漫", c: false },
        { title: "冒险", c: false },
        { title: "科技", c: true },
        { title: "军事", c: false },
        { title: "娱乐", c: false },
        { title: "奇闻", c: false },
      ],
    };
  },
  computed:{
    newArr(){
      return this.array.filter((item)=>item.c === true)
    }
  }
};
</script>

<style>
</style>